import { PureComponent } from "react";
import { isNull, combineDefaultArr, handleSelect } from "../../utils/helper"
import MySelectMoreOther from "./MyForm/MySelectMoreOther"
interface Props {
	isReset: boolean,
	formData: object,
	field: string[],
	dataset_key?: string,
	value_datatype?: string,
	getFieldValue: Function,
	setFieldsValue: Function,
	fd: object,
	field_mapping?: object,
	getFieldDecorator: Function,
	defaultFormData: object,
	label?: string,
	required?: any,
	list: any[],
	other_field?: string,
	value: any,
	onChange: Function
}
interface State {
	hasError: boolean,
	errorMsg: string
}
export default class MiSelectMoreOther extends PureComponent<Props, State> {
	public state: State = {
		hasError: false,
		errorMsg: ""
	}
	componentWillReceiveProps(next: Props) {
		let { isReset: oldReset, formData: oldFD } = this.props;
		let { isReset: newReset, formData: newFD, field, dataset_key, value_datatype, getFieldValue, setFieldsValue } = next;
		if (oldReset !== newReset) {
			if (newReset) {
				this.setState({
					hasError: false
				});
				let newVal = newFD[field[0]];
				let newName = newFD[field[1]];
				if (!isNull(newVal) && newVal.toString().indexOf("-1") != -1) {
					getFieldValue([field[1]]);
					setFieldsValue({
						[field[1]]: newName
					})
				}
			}

		}

		if (oldFD[field[0]] !== newFD[field[0]]) {
			setTimeout(() => {
				let { fd, field_mapping = {} } = this.props;
				let val = newFD[field[0]];
				let list = fd[dataset_key] || [];
				if (!isNull(val) && val.indexOf("-1") != -1) {// -1为 其他选项的code 如果包含其他 就在My组件里面处理 不在这里处理
					return;
				}
				let newVal = combineDefaultArr(list, val, "code", value_datatype);
				let selectOption = [];
				newVal.map(item => {
					let arr = list.filter(i => i.code === item)[0];
					selectOption.push(arr);
				});
				if (selectOption.length == 0) {
					field.map((item, key) => {
						if (key !== 0) {
							getFieldValue(item);
							setFieldsValue({
								[item]: undefined
							})
						}
					})
				}
				else {
					let newObj = {};
					selectOption.map(item => {
						let otherObj = handleSelect(field, item, field_mapping);
						for (let i in otherObj) {
							if (newObj.hasOwnProperty(i)) {
								newObj[i] = newObj[i] + "," + otherObj[i];
							}
							else {
								newObj[i] = otherObj[i];
							}
						}
					});
					for (let i in newObj) {
						getFieldValue(i);
						setFieldsValue({
							[i]: newObj[i]
						})
					}
				}
			}, 300)
		}
	}
	render() {
		let { getFieldDecorator, field, defaultFormData, label, required, list, formData, other_field } = this.props;
		if (list && list.length > 0) {
			list = list.map(i => {
				return {
					...i,
					label: i.name,
					value: i.code
				}
			})
		}
		list = [list];
		let { hasError, errorMsg } = this.state;
		let isRequired = required == 1;
		return (
			<div>
				{field[1] && getFieldDecorator([field[1]])(<div></div>)}
				{
					getFieldDecorator(field[0], {
						initialValue: defaultFormData[field[0]],
						rules: [
							{
								validator: (rule, value, callback) => {
									if (isRequired) {
										if (isNull(value) && isNull(formData[other_field])) {
											if (!hasError) {
												this.setState({
													hasError: true,
													errorMsg: "请选择：" + label
												})
												callback("请选择：" + label)
											}
										}
										else {
											this.setState({
												hasError: false,
												errorMsg: ""
											})
											callback()
										}
									}
									callback()
								}
							}
						]
					})(
						<MySelectMoreOther {...this.props} hasError={hasError} errorMsg={errorMsg} />
					)
				}
			</div>
		)
	}
}
